<template>
    <ul>
        <li :key='talent.member_id' v-for='talent in talent_list'>
            <!-- <router-link :to="'/user/'+talent.member_id"> -->
                <div class="img-container bg-container">
                <img 
                :src="talent.head_img" alt="头像"  
                onerror="javascript:;this.src='https://www.manydoctor.com/static/img/profile.jpg'">
                </div>
            <!-- </router-link> -->
            <div class="doctor-info">
                <span>{{ talent.nick_name }}</span>
                <p><i class="light-gray">粉丝</i> {{ talent.fans_count }}</p>
                <div>
                    <button class="small-btn">关注</button>
                </div>
            </div>
        </li>
    </ul>
</template>
<script>
    export default{
        props:['talent_list'],
    }
</script>
<style lang="less" scoped>
    ul{
        position: relative;
        z-index: 3;
        li{
            overflow: hidden;
            width: 246px;
            margin-bottom: 15px;
            cursor: pointer;
            .img-container{
                width: 80px;
                height: 80px;
                float: left;
                overflow: hidden;
                img{
                    width: 100%;
                }
            }
            .doctor-info{
                float: right;
                width: 150px;
                span{
                    display: inline-block;
                    margin-top: 5px;
                }
                p{
                    margin-top: 10px;
                }
                div{
                    text-align: right;
                }
            }
        }
    }
</style>
